<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			h4,p{
				/*同时设置h4,p的样式*/
				padding: 0;
				margin: 0;
			}
			li{
				/*无序列表，去掉小点*/
				list-style: none;
				width: 140px;
				height: 190px;
				/*background: url(img/jd/jd1.webp);*/
				/*background-size: 140px 190px*/;
				text-align: center;
				border: 1px solid white;
				float: left;
				margin-left: 5px;
			}
			#bg1{
				background: url(img/jd/jd1.webp);
				background-size: 140px 190px;
			}
			#bg2{
				background: url(img/jd/jd2.webp);
				background-size: 140px 190px;
			}
			#bg3{
				background: url(img/jd/jd3.webp);
				background-size: 140px 190px;
			}
			#bg4{
				background: url(img/jd/jd4.webp);
				background-size: 140px 190px;
			}
			#bg5{
				background: url(img/jd/jd5.webp);
				background-size: 140px 190px;
			}
			#bg6{
				background: url(img/jd/jd6.webp);
				background-size: 140px 190px;
			}
			#bg7{
				/*background: url是简写，包含了background-size*/
				background: url(img/jd/jd7.webp);
				background-size: 140px 190px;
			}
			a{
				text-decoration: none;
				color: white;
			}
			h4{
				padding-top: 20px;
			}
			p{
				margin-top: 10px;
				tab-size: 12px;
			}
			.bgcolor1{
				height: 80px;
				margin-top: 110px;
				background-color: #916D56;
				
			}
			.bgcolor2{
				height: 80px;
				margin-top: 110px;
				background-color: #7D6386;
				
			}
			.bgcolor3{
				height: 80px;
				margin-top: 110px;
				background-color: #B72D35;
				
			}
			.bgcolor4{
				height: 80px;
				margin-top: 110px;
				background-color: #549B6E;
				
			}
			.bgcolor5{
				height: 80px;
				margin-top: 110px;
				background-color: #DD6A52;
				
			}
			.bgcolor6{
				height: 80px;
				margin-top: 110px;
				background-color: #5C91B6;
				
			}
			.bgcolor7{
				height: 80px;
				margin-top: 110px;
				background-color: #D7C11D;
				
			}
		</style>
	</head>
	<body>
		<ul>
			<li id="bg1">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor1">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg2">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor2">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg3">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor3">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg4">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor4">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg5">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor5">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg6">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor6">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
			<li id="bg7">
				<a href="http://jd.com">
				<!--文字-->
				<div class="bgcolor7">
					<h4>司法拍卖</h4>
					<p>法院好货 公开抢拍</p>
				</div>
				</a>
			</li>
		</ul>
	</body>
</html>
